<template>
  <div>
    <van-pull-refresh v-model="isLoading" @refresh="onRefresh">
      <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
        <div class="itemdisease" v-for="(item,index) in list" :key="index">
          <div class="name">{{item.name}}</div>
        <div class="ismedicalInsurance">是否纳入医保：{{item.medicalInsurance}}</div>
        <div class="scalias">
          俗称：
          <span v-for="(items,i) in item.alias" :key="i">{{items}}</span>
        </div>
        <div class="infectiousness">
          传染性：
          <span>{{item.infectiousness}}</span>
        </div>
        <div>
          症状：
          <span class="typicalSymptom">{{item.typicalSymptom}}</span>
        </div>
        </div>
      </van-list>
    </van-pull-refresh>
  </div>
</template>
<script>
import { PullRefresh ,List} from 'vant';
export default {
    // @refresh — —下拉刷新事件
    // @load — — 上拉加载翻页事件
    // ：finished — — 数据全部加载完 显示 finished-text
    // loading — —  显示加载中
    components:{
        [PullRefresh.name]:PullRefresh,
        [List.name]: List
    },
    data(){
        return{
            list:[],
            loading: false,
            finished: false,
            isLoading: false,
            listQuery:{
              page :1,
              pageSize:15
            }
        }
    },
    methods:{
      onLoad(){
        setTimeout(()=>{
          this.getCardConsume();
          this.loading = true;
        },500)
      },
      async getCardConsume(){
        let isdata = {
            apiKey:"Ib3I1727eb283024b369d60868c8f7b3a719354fd552991",
            symptom: "咳嗽",
            page:this.listQuery.page,
            pageSize: this.listQuery.pageSize
          }
        let res = await this.$axios.post(
          '/api/common/disease/queryDiseaseListBySymptom',
          isdata
        )
        if(res.statusCode== '000000'){
            this.loading = false;
            this.list = this.list.concat(res.result.diseaseList);
            this.listQuery.page++;
            if(this.list.length === res.result.totalCount) {
              this.finished = true;
            }
        }
      },
      onRefresh(){
        setTimeout(()=>{
          this.$toast("刷新成功");
          this.isLoading = false;
          this.list = [];
          this.listQuery.page = 1;
          this.loading = false;
          this.finished = false;
          this.getCardConsume()
        }, 500)
      }
    }
};
</script>
<style scoped lang="less">
.itemdisease {
  font-size: 16px;
  border-bottom: solid 1px #9fd8f9;
  padding: 10px 8px;
  color: #000000;
  .name {
    font-weight: bold;
  }
  .scalias {
    span {
      color: #999999;
    }
  }
  .typicalSymptom {
    color: #999999;
  }
}
</style>